<!--
 * @description  : 市管检查-许可证问题组件
 * @descriptionDetail: 市管检查-许可证问题组件
 * @copyright    : 浙江烟草
 * @author       : sy
 * @create       : 2022-07-09 18:43:02
-->
<template>
  <view>
    <theme-navbar
      :isBack="true"
      :is-white="false"
      title="许可证问题"
      :customBack="handlerBack"
      style="z-index: 99999"
    >
      <view class="nav-right-icon" v-if="!isDisabled" @tap="handlerSure">
        确定
      </view>
    </theme-navbar>
    <view>
      <view v-for="(item, idx) in records" :key="idx">
        <u-cell-item :title="item.itemName" :arrow="false" class="cell" :title-style="mainLabelStyle" v-if="item.operateType == '91401'">
          <u-switch slot="right-icon" v-model="checkObj[item.checkKey]" @change="handlerSwitch"></u-switch>
        </u-cell-item>
        <u-field
          type="textarea"
          placeholder="请输入"
          label="备注"
          label-width="80"
          style="height: 100px;"
          :disabled="isDisabled"
          v-else
          v-model="checkObj[item.checkKey]"
        >
        </u-field>
        <view v-show="checkObj[item.checkKey] && item.operateType == '91401'">
          <u-cell-item class="cell cell-sub" title="处理方式" :value="item.checkDataLabel" :arrow="true" @click="handlerShowSelect(item)"></u-cell-item>
          <view v-for="(record, rIdx) in item.nextRecords" :key="rIdx">
            <u-cell-item class="cell cell-sub" :title="record.itemName" :arrow="false">
              <u-switch slot="right-icon" v-model="checkObj[record.checkKey]" @change="handlerSwitch"></u-switch>
            </u-cell-item>
            <view v-for="(nRecord, nrIdx) in record.nextRecords" v-show="checkObj[record.checkKey]" :key="nrIdx">
              <u-input
                style="margin: 5px 15px 5px 30px;"
                :placeholder="'请输入' + nRecord.itemName"
                type="text"
                :border="true" 
                v-model="nRecord.checkData"
              />
            </view>
          </view>
        </view>
        <u-select :list="item.dealList" :mask-close-able="false" v-model="item.showSelect" @cancel="handlerCloseSelect(item)" @confirm="handlerConfirm($event, item)"></u-select>
      </view>
    </view>
  </view>
</template>
<script>
export default {
  name: "LicenceCom",
  props: {
    menuData: {
      type: Object,
      default: () => {},
    },
    recordDatas: {
      type: Array,
      default: () => [],
    },
    isDisabled: {   // 是否可编辑
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      records: this.recordDatas,
      checkObj: {},
      preFix: 'L',  // 指标前缀
      mainLabelStyle: {
        // 'color': '#000',
        // 'fontWeight': '600',
      },
      dealMap: {},  // 处理方式字典
    }
  },
  watch: {
    recordDatas(v) {
      console.log("监听", v);
      this.records = v;
    },
  },
  created () {
    let dicts = uni.getStorageSync('caseDicts');
    dicts.forEach(d => {
      if (d.bctPhName == 'M_CHECK_HANDLE_RESULT_ZJ') {
        this.dealMap[d.bcbCode] = d.bcbName;
      }
    });
    this.records.forEach(r => {
      r.checkKey = this.preFix + r.itemUuid;
      this.$set(this.checkObj, r.checkKey, r.checkData || (r.operateType == '91401' ? r.defaultValue == 'true' : ''));
      // 子项
      r.nextRecords && r.nextRecords.forEach(nr => {
        nr.checkKey = this.preFix + nr.itemUuid;
        this.$set(this.checkObj, nr.checkKey, nr.checkData || (nr.operateType == '91401' ? nr.defaultValue == 'true' : ''));
      });
      // 处理方式
      r.dealList = [];
      r.jgsxDealUuidZj && r.jgsxDealUuidZj.split(",").forEach(j => r.dealList.push({label: this.dealMap[j], value: j, itemUuid: r.itemUuid,}));
    });
  },
  methods: {
    // 是否选中
    handlerSwitch(isChecked, ck) {
      if (this.isDisabled) {
        return false;
      }
      this.checkObj[ck] = isChecked;
    },
    // 显示选择处理方式
    handlerShowSelect(item) {
      item.showSelect = true;
      this.$forceUpdate();
    },
    // 关闭处理方式选择框
    handlerCloseSelect(item) {
      item.showSelect = false;
      this.$forceUpdate();
    },
    // 处理方式
    handlerConfirm(e, item) {
      console.log(e, item);
      item.checkData = e[0].value;
      item.checkDataLabel = e[0].label;
      item.showSelect = false;
      this.$forceUpdate();
    },
    // 确定
    handlerSure() {
      // 处理数据
      Object.keys(this.checkObj).forEach(k => this.recursive(this.records, k));
      console.log("处理后的数据", this.records);
      this.$emit("ok", this.records);
    },
    // 递归赋值选中项
    recursive(arr, ck) {
      arr.forEach(item => {
        if (item.itemUuid == ck.replace(this.preFix, "")) {
          item.checkData = this.checkObj[ck];
        } else {
          if (item.nextRecords) {
            this.recursive(item.nextRecords, ck)
          }
        }
      })
    },
    // 关闭
    handlerBack() {
      this.$emit("close", true);
    },
  },
}
</script>
<style lang="scss" scoped>
@import "@/style/common/rightMenu.scss";
.cell {
  padding: 10px 16px;
}
.cell-sub {
  padding-left: 30px;
}
</style>